<template>
  <van-cell title="id" :value="user.id"/>
  <van-cell title="账号" :value="user.userAccount"/>
  <van-cell title="昵称" :value="user.username" is-link @click="onEdit('username', '昵称', user.username)"/>
  <van-cell title="性别" :value="UserGender[user.gender]" is-link @click="onEdit('gender', '性别', user.gender)"/>
  <van-cell title="头像" :value="user.avatarUrl" is-link @click="onEdit('avatarUrl', '头像', user.avatarUrl)">
    <van-image :src="user.avatarUrl" width="50%"></van-image>
  </van-cell>
  <van-cell title="电话" :value="user.phone" is-link @click="onEdit('phone', '电话', user.phone)"/>
  <van-cell title="邮箱" :value="user.email" is-link @click="onEdit('email', '邮箱', user.email)"/>
  <van-cell title="标签" :value="user.userTags" is-link @click="onEdit('userTags', '标签', user.userTags)"/>
  <van-cell title="身份" :value="UserRole[user.userRole]"/>
  <van-cell title="创建时间" :value="parseDateTime(user.createTime)"/>
</template>

<script setup lang="ts">

import {useRouter} from "vue-router";
import {onMounted, ref} from "vue";
import {getCurrentUser} from "../../services/api";
import {UserGender, UserRole} from "../../constants/UserInfoEnum";
import parseDateTime from "../../utils/DateTimeUtils";
const router = useRouter();

const user = ref({})

onMounted(async () => {
  const loginUser = await getCurrentUser();
  if (loginUser) {
    user.value = loginUser;
  }
})

const onEdit = (editKey: string, title: string, currentValue: string) => {
  router.push({
    path: '/person/edit',
    query: {
      editKey,
      title,
      currentValue
    }
  })
}
</script>

<style scoped>

</style>